<template>
	<view class="password_wrap">
		<u--form
			class="password_form"
			ref="uForm"
			labelWidth="auto"
			labelPosition="top"
			:model="model1"
			:rules="rules"
		>
			<u-form-item
				label="交易密码"
				prop="password"
				ref="item1"
				:required="true"
			>
				<u--input
					class="password_input"
					border="surround"
					type="password"
					placeholder="请输入交易密码"
					v-model="model1.password"
				></u--input>
			</u-form-item>
			<u-form-item
				label="密码确认"
				prop="isPassword"
				ref="item1"
				:required="true"
			>
				<u--input
					type="password"
					class="password_input"
					placeholder="请再次输入交易密码"
					v-model="model1.isPassword"
					border="surround"
				></u--input>
			</u-form-item>
		</u--form>
		<u-button class="password_btn" shape="circle" color="var(--echo-main-color)" @click="submit">确定</u-button>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				model1:{
					password:'',
					isPassword:'',
				},
				rules: {
					password: [
						{
							required: true,
							message: '请输入交易密码',
						}
					],
					isPassword: [
						{
							required: true,
							message: '请再次输入交易密码',
						}
					],
				},
			}
		},
		methods:{
			submit() {
				this.$refs.uForm.validate().then(res => {
					console.log(this.model1.password)
				}).catch(errors => {
					return
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.password_wrap {
		margin: 140rpx 50rpx 0;
		.password_form {
			margin-bottom: 20rpx;
		}
	}
</style>